<script>
import axios from 'axios'

export default ({
  name: 'mySearch',
  data() {
    return {
      keyWord: ""
    }
  },
  methods: {
    getUserListByKeyWord() {
      //初始化objData中的数据
      this.$bus.$emit("updateListData",{
        userList:[],
        isFirst:false,
        isLoading:true,
        ergMag:''
      })
      axios.get('https://api.github.com/search/users?q=' + this.keyWord).then(
          response => {
            //请求成功后处理objData中的数据
            this.$bus.$emit("updateListData",{
              userList:response.data.items,
              isLoading:false,
              ergMag:''
            })
          },
          error => {
            //请求失败后处理objData中的数据
            this.$bus.$emit("updateListData",{
              userList:[],
              isLoading:false,
              ergMag:error.message
            })
          }
      )
    }
  }
})
</script>

<template>
  <section class="jumbotron">
    <h3 class="jumbotron-heading">Search Github Users</h3>
    <div>
      <input type="text" class="form-control" placeholder="enter the name you search" v-model="keyWord"/>&nbsp;<button
        @click="getUserListByKeyWord">Search
    </button>
    </div>
  </section>
</template>

<style scoped>

</style>